import React, { useState, useEffect } from "react";
import IdeaCanvasForm from "./IdeaCanvasForm";
import { Tabs, Tab } from "react-bootstrap";
import IdeaCanvasList from "./IdeaCanvasList";
import supabaseClient from "../utils/supabaseClient";

const IdeaCanvasApp = () => {
  const [load, setLoad] = useState(1);
  const tabSelect = (key) => {
    if (key === "list") {
      setLoad(load + 1);
    }
  };

  return (
    <>
      <Tabs
      defaultActiveKey="form"
        className="mb-3"
        onSelect={tabSelect}
      > 
        <Tab eventKey="form" title="创意画布">
          <IdeaCanvasForm />
        </Tab>
        <Tab eventKey="list" title="我的创意">
          <IdeaCanvasList load={load} />
        </Tab>
      </Tabs>
    </>
  );
};

export default IdeaCanvasApp;
